<script>

    import { ref } from 'vue';

    //组合式api: 不区分模块, data methods 混合到setup方法中
    export default {
      setup() {
        const count = ref(0);
        
        const increase = () => {
           count.value++;
        };

        const decrease = () => {
          count.value--;
        };
        return {
          count,
          increase,
          decrease
        };
      }
    }

</script>

<template>
  <div>
    <button @click="decrease()">-</button> {{ count }} <button @click="increase()">+</button>
    <p>xxxxxx</p>
  </div>
</template>

<style scoped>

</style>